import ajax from "../../util/request";
import { useState,useEffect } from "react";
import {useParams,NavLink} from "react-router-dom";
import "./news-list.css";

function NewsList() {
    // 使用钩子函数创建一个状态
    const [list, setList] = useState([]);

    // useParams钩子函数：获取路由的params传参
    const params = useParams();

    // 传入非空数组，数组中的数据发生变化，会触发函数执行
    useEffect(() => {
        ajax("/content/queryList", { t_cat_plant_fk: params.t_cat_plant_pk, rows: 10 }).then(res => {
            if (res.data.status > 0) {
                setList(res.data.result_data);
            }
        })
    }, [params.t_cat_plant_pk])

    const headers = [
        {title: '学院新闻',t_cat_plant_pk: 405},
        {title: '党建动态',t_cat_plant_pk: 406},
        {title: '通知公告',t_cat_plant_pk: 407},
        {title: '分院动态',t_cat_plant_pk: 408}
    ]


    return (
        <div>
            <header>
                {headers.map(v => <NavLink 
                className="header-link"
                to={'/hello/newsList/' + v.t_cat_plant_pk} 
                key={v.t_cat_plant_pk}>{v.title}</NavLink>)}
            </header>
            <ul>
                {list.map(v => (
                    <li key={v.t_content_pk}>{v.title}</li>
                ))}
            </ul>
        </div>
    )
}

export default NewsList;